import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:flutter_todolist/pages/auth/widget/auth_input.dart';
import 'package:flutter_todolist/util.dart';
import 'package:flutter_todolist/utils/extention.dart';
import 'package:get/get.dart';
import 'package:font_awesome_flutter/font_awesome_flutter.dart';

import '../../widgets/app_button.dart';
import 'auth_login_controller.dart';
import 'auth_register.dart';

class AuthPage extends StatelessWidget {
  AuthPage({Key? key}) : super(key: key);

  final authLoginCtrl = Get.put(AuthLoginController());

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.white,
      resizeToAvoidBottomInset: false,
      body: Container(
        margin: EdgeInsets.symmetric(horizontal: 30.w),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            100.h.hSizedBox(),
            top(),
            20.h.hSizedBox(),
            // tabs(),
            // 20.h.hSizedBox(),
            Expanded(child: login())
          ],
        ),
      ),
    );
  }

  Widget top() {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Container(
          child: Center(
            child: 'Clipboard'.assetsImg(width: 120.r, height: 120.r, fit: BoxFit.cover),
          ),
        ),
        20.h.hSizedBox(),
        '登录'.text(fontSize: 28),
      ],
    );
  }

  Widget login() {
    return Column(
      children: [
        AuthInput(
          prefix: '@'.text(fontSize: 20.sp, color: const Color(0xFF85888c)),
          hintText: 'enter account',
          controller: authLoginCtrl.accountCtrl,
        ),
        10.h.hSizedBox(),
        Obx(() => AuthInput(
          prefix: FaIcon(FontAwesomeIcons.lock, color: const Color(0xFF85888c), size: 18.r),
          hintText: 'enter password',
          controller: authLoginCtrl.passwordCtrl,
          inputFormatter: [
            LengthLimitingTextInputFormatter(11),
            // FilteringTextInputFormatter.digitsOnly
          ],
          suffix: GestureDetector(
            onTap: () {
              authLoginCtrl.passwordSwitch();
            },
            child: FaIcon(
                authLoginCtrl.passwordSecure.value == true
                    ? FontAwesomeIcons.eyeSlash : FontAwesomeIcons.eye ,
                color: const Color(0xFF85888c), size: 18.r),
          ),
          obscureText: authLoginCtrl.passwordSecure.value,
        )),
        10.h.hSizedBox(),
        Row(
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          children: [
            GestureDetector(
              child: '新用户注册'.text(color: CustomColors.PurpleLight),
              onTap: () {
                Get.to(() => const AuthRegister());
              },
            ),
            // .onPress(() {
            //   Get.to(() => const AuthRegister());
            // }),
            // '暂不登录'.text(color: const Color(0xFF85888c))
            // .onPress(() {
            //   Get.offAll(() => BottomNavPage());
            // })
          ],
        ),
        40.h.hSizedBox(),
        AppButton(
          height: 40.h,
          content: 'login',
          // color: const Color(0xFF0048f8),
          gradientColors: const [
            CustomColors.PurpleDark,
            CustomColors.PurpleAccent,
          ],
          // color: CustomColors.PurpleAccent,
          onTap: () {
            //call login api
            authLoginCtrl.login();
          },
        ),

      ],
    );
  }


}

